﻿<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>平移缩放示例</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" type="text/css" href="./theme/style.css"/>
    <script type="text/javascript" src="../lib/import.js"></script>
</head>
<body>
<div id="header" class="nav-header">
    <div class="nav-header-icon">NTOPO</div>
    <ul>
        <li><a class="nav-header-button" onclick="refresh()" href="javascript:void(0)" title="运行">运行</a></li>
        <li><a class="nav-header-button" onclick="screen()" href="javascript:void(0)" title="切换视图">切换视图</a></li>
        <li><a class="nav-header-button" onclick="exportToXMLToTextArea()" href="javascript:void(0)" title="导出">导出</a>
        <li><a class="nav-header-button" onclick="alarmTest()" href="javascript:void(0)" title="告警">告警</a>
        </li>
    </ul>
</div>

<div id="container" class="container">
    <div class="col-md-left">
        <div class="code-header ls1 lr04">code示例</div>
        <div class="code ls1 lr04">
            <textarea id="code">
<topo>
    <lines>
        <line id="line001" type="line1" start="device002" end="device001" points="1000,1000"/>
    </lines>
    <nodes>
        <node id="device001" type="server" point="1000,900" text="右键菜单">
            <property key="ip">1.2.3.1</property>
            <!--<component type="popup" width="200" height="100" href="./data/popup.html"-->
            <!--title="${text}">-->
            <!--</component>-->
            <component type="popup" width="200" height="100" title="${text}">
                <item label="设备名：">${text}</item>
                <item label="设备IP：">${ip}</item>
            </component>
            <component type="menu">
                <item id="hideNode" label="匿名函数"
                      onclick="function(item){alert('匿名函数执行;label:' + item.label);}"/>
                <item id="delNode" label="JS脚本" onclick="alert('js脚本执行')"/>
                <item id="Separator" type="Separator"/>
                <item id="unSelectNode" label="超链接" onclick="href:http://www.topsec.com.cn"/>
            </component>
            <component type="circle" offset="20,-30" r="4" fill="#AAFFAA">
                <match target="blink" condition="true" value=""/>
                <match target="r" condition="${alarm_num}&amp;gt;6" value="9"/>
                <match target="r" condition="${alarm_num}&amp;lt;=6 &amp;amp;&amp;amp;" value="4"/>
            </component>
        </node>
        <node id="device002" type="server" point="1100,1050" text="自定义右键菜单">
            <property key="ip">1.2.3.2</property>
        </node>
    </nodes>
    <types>
        <type name="server">
            <property key="shape">imageText</property>
            <property key="iconSize">32,32</property>
            <property key="icon">./theme/device/server.png</property>
            <component type="circle" offset="-20,-30" r="4" fill="#AAFFAA"/>
        </type>
        <type name="line1">
            <property key="shape">line</property>
            <property key="stroke">#57C600</property>
        </type>
    </types>
</topo>
            </textarea>
        </div>
    </div>
    <div class="col-md-right">
        <div class="main ls1 lr04" id="topo"></div>
    </div>
</div>
<script src="../lib/example.js"></script>
</body>
</html>